import React from 'react';
import { Spin, List, Tag } from 'antd';
import moment from 'moment';
import { Link, router } from 'umi';
import { eventTrack } from '@/utils/track';
import authHelper from '@/utils/auth/helper';
import { MoreBar } from '../common/TabBarExtraContent';
import styles from '../../homepage.less';

const { checkCode } = authHelper;

// const { TabPane } = Tabs;
/**
 * 新闻公告
 */
const Xwgg = props => {
    const { dataSource, responders } = props;
    const { droppableProps, onAdd } = responders;
    // const [spinning, setSpinning] = useState(false);
    const spinning = false;
    // const [sourceData, setSourceData] = useState([]);
    return (
        <Spin spinning={spinning}>
            <div>
                <div className={styles.wnNoticeTitle}>
                    <h4>新闻公告</h4>
                    <MoreBar
                        linkProps={{
                            to: '/personal/portal/notice',
                            onClick: (e, url) => {
                                // 埋点
                                eventTrack({
                                    eventName: 'new_notice_more_click',
                                    pageName: 'personal_portal'
                                });
                                history.push(url);
                            }
                        }}
                        isDelete={false}
                        onAdd={onAdd}
                    />
                </div>
                {/* <TabPane tab="新闻公告" key="1"> */}
                <List
                    itemLayout="horizontal"
                    dataSource={dataSource}
                    split={false}
                    renderItem={item => (
                        <List.Item key={item.id.toString()} className={styles.workList}>
                            <List.Item.Meta
                                className={styles.workListMeta}
                                title={
                                    !checkCode('portal:mine:article:notice:detail') ? (
                                        item.title
                                    ) : (
                                        <Link
                                            onClick={() => {
                                                // 埋点
                                                eventTrack({
                                                    eventName: 'new_notice_context_click',
                                                    pageName: 'personal_portal',
                                                    eventProps: {
                                                        click_context: item.title
                                                    }
                                                });
                                            }}
                                            to={{
                                                pathname: '/personal/portal/notice/noticeDetail',
                                                query: {
                                                    noticeId: item.id
                                                }
                                            }}
                                        >
                                            <Tag color="red">公告</Tag>
                                            {item.title}
                                        </Link>
                                    )
                                }
                            />
                            <div className={styles.wnlist_time}>
                                {droppableProps['data-rbd-droppable-id'] === 'droppable'
                                    ? moment(item.startTime).format('YYYY-MM-DD HH:mm')
                                    : moment(item.startTime).format('YYYY-MM-DD')}
                            </div>
                        </List.Item>
                    )}
                />
            </div>
            {/* </TabPane> */}
            {/* </Tabs> */}
        </Spin>
    );
};
export default Xwgg;
